<script setup lang="ts">
import { defaults, type GatewayInfo } from '../../composable'
import type { CustomDialogInstance } from '@/types'

withDefaults(defineProps<{
  info: GatewayInfo
}>(), {
  info() {
    return { ...defaults }
  },
})

const dialogRef = ref<CustomDialogInstance>()

function open() {
  dialogRef.value?.open()
}
function close() {
  dialogRef.value?.close()
}

defineExpose({
  open,
  close,
})
</script>

<template>
  <CustomDialog
    ref="dialogRef"
    title="网关信息"
    width="740px"
    :show-confirm-button="false"
    cancel-button-text="关闭"
  >
    <ElDescriptions :column="2" title="" border>
      <ElDescriptionsItem label="网关编号" :width="100">
        {{ info.gatewayNumber }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="网关名称" :width="100">
        {{ info.gatewayName }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="规格型号">
        {{ info.gatewayModel }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="生产厂家">
        {{ info.gatewayManufacturer }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="安装位置">
        {{ info.gatewayLocation }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="安装厂家">
        {{ info.gatewayInstallManufacturer }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="安装时间">
        {{ info.gatewayInstallTime }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="安装方式">
        {{ info.gatewayInstallWay }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="运行状态">
        {{ info.gatewayStatusName }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="状态发生时间">
        {{ info.gatewayStatusTime }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="IP地址">
        {{ info.gatewayIp }}
      </ElDescriptionsItem>
    </ElDescriptions>
  </CustomDialog>
</template>
